import QtQuick 1.0
import "Components"

Rectangle {
    id: _root
    width: 300
    gradient: Gradient {
        GradientStop {
            position: 0
            color: "#0320ff"
        }

        GradientStop {
            position: 1
            color: "#000000"
        }
    }
    border.color: "#000000"
    height: _title.height + 20

    property string appState: "Home"
    property bool loading: false

    Text {
        id: _title
        color: "#ffffff"
        text: "Rewit"
        font.pointSize: 14
        anchors.leftMargin: 5
        anchors.left:  parent.left
        anchors.verticalCenter: parent.verticalCenter
        smooth: true

    }

    Text {
        id: _state
        color: "#ffffff"
        text: "-" + appState + "-"
        anchors.left: _title.right
        anchors.leftMargin: 5
        font.pointSize: 12
        anchors.verticalCenter: parent.verticalCenter
        smooth: true
    }

    ImageButton {
        id: _update
        width: 33
        height: 33
        anchors.rightMargin: 5
        anchors.right: _tweet.left
        anchors.verticalCenter: parent.verticalCenter

        imageIdle: "../images/btn_update_i.png"
        imagePress: "../images/btn_update_p.png"

//        //回転させる
//        NumberAnimation on rotation {
//            from: 0
//            to: 360
//            duration: 1500
//            loops: Animation.Infinite
//            running: _root.loading
//        }

        onClicked: {
            _contentContainer.update();
        }
    }

    ImageButton {
        id: _tweet
        width: 28
        height: 28
        anchors.rightMargin: 5
        anchors.right: _menu.left
        anchors.verticalCenter: parent.verticalCenter

        imageIdle: "../images/btn_tweet_i.png"
        imagePress: "../images/btn_tweet_p.png"

        onClicked: {
            if(_tweetContainer.opacity < 1.0){
                _rootContainer.state = "";
            }else{
                _rootContainer.state = "NoneTweet";
            }

        }
    }

    ImageButton {
        id: _menu
        width: 33
        height: 33
        anchors.rightMargin: 5
        anchors.right: parent.right
        anchors.verticalCenter: parent.verticalCenter

        onClicked: {
            if(_menuContainer.state !== "Menu"){
                _menuContainer.state = "Menu";
            }
        }
    }


    MouseArea {
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.bottom: parent.bottom
        anchors.right: _update.left

        onClicked: {
            _contentContainer.state = "";
        }
    }
}
